<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<style type="text/css">
		div {
			width: 200px; height: 200px;
			
			
		}
	</style>
	<body>
		<div id="box" style=" background: #f40;
			border-left-color: black;
			border-left-width: 8px;
			border-left-style: double;">
			background: #f40;
				border-left-color: black;
				border-left-width: 8px;
				border-left-style: double;
		</div>
		
		<p>四个边框粗细不一样</p>
		<div style="border-color: black; border-style: solid; border-width: 5px 10px 15px 20px;">
			border-color: black; border-style: solid; border-width: 5px 10px 15px 20px;
		</div>
		
		<p>三角形制作</p>
		<ul>
			<li>元素本身大小 width、height设为0 </li>
			<li>边框宽度设为 top: 60px left: 80px right: 80px bottom: 30px</li>
			<li>边框类型设为 solid 实线</li>
			<li>边框颜色设为 top: red left: right: bottom: transparent</li>
		</ul>
		<div style="border-top-width: 60px; border-left-width: 80px; border-right-width: 80px;  border-bottom-width: 30px;border-style: solid; width: 0; height: 0; border-left-color: transparent; border-top-color:green;border-right-color:transparent; border-bottom-color: transparent;">
			
		</div>
	</body>
</html>